import React,{Component} from 'react';
import ReactSwipe from 'react-swipe';
import axios from 'axios';
import {Carousel} from 'react-bootstrap';

class Banner extends Component{
    render(){
       var  style={
            Banner:{
                width:"100%",
                height:"496px"
               
            }
        }
        return(
            <div  className=""  style={style.Banner}>
                <ReactSwipe className='' 
                swipeOptions={{continous:true,auto:2000}} >
                    <div><img style={style.Banner} src="https://ss0.bdstatic.com/70cFvHSh_Q1YnxGkpoWK1HF6hhy/it/u=1187514519,1466827467&fm=27&gp=0.jpg"/></div>
                    <div><img  style={style.Banner} src="https://ss1.bdstatic.com/70cFuXSh_Q1YnxGkpoWK1HF6hhy/it/u=2114605024,995876269&fm=27&gp=0.jpg"/></div>
                    <div><img style={style.Banner} src="https://ss0.bdstatic.com/70cFvHSh_Q1YnxGkpoWK1HF6hhy/it/u=1660138183,1040754863&fm=27&gp=0.jpg"/></div>
                </ReactSwipe>
            </div>
           
        )
    }
}


class Home extends Component{

    constructor(){
        super();
        this.state={
            looplist:[]
        }
    }
   /* componentWillMount() {
        axios.get('localhost:3000/banner/list').then(res=>{
            console.log(res.data)
        })
    }*/
    render(){
    var style={
        div:{
            width:"100%",
            height:"496px"
        }
    }
        return (
            <div style={style.div}>
               <Banner/>
           </div>
        )
    }
}
export default Home;